<template>
  <div class="page-card article-page">
    <h-query :showKey="['title']" @search="search">

    </h-query>
    <h-table
      ref="htable"
      @init="getList"
      :config="config"
      :showHeadBgNone="false"
      :zebraStripes="false">
      <span slot="quality" slot-scope="{text, record}">
        <a-tag :color="quality[record.quality].color">{{ quality[record.quality].label }}</a-tag>
      </span>
    </h-table>

  </div>
</template>
<script>
import { componeyList } from '@/api/serve';
export default {
  data() {
    return {
      config: {
        rowKey: 'id',
        bordered: true,
        dataSource: [],
        columns: [
          {
            align: 'center',
            title: '序号',
            dataIndex: 'index',
            scopedSlots: { customRender: 'index' }
          },
          {
            align: 'center',
            title: '第三方公司名称',
            dataIndex: 'companyName',
            width: 400
          },
          {
            align: 'center',
            title: '指令接收次数',
            dataIndex: 'receive'
          },
          {
            align: 'center',
            title: '数据上报次数',
            dataIndex: 'escalation'
          },
          {
            align: 'center',
            title: '平均响应时间',
            dataIndex: 'cycle'
          },
          {
            align: 'center',
            title: '采集质量',
            dataIndex: 'quality',
            scopedSlots: { customRender: 'quality' }
          }
        ],
        pagination: {
          total: 100
        }
      },
      form: {

      },
      quality: {
        1: {
          label: '普通',
          color: ''
        },
        2: {
          label: '良好',
          color: 'blue'
        },
        3: {
          label: '优秀',
          color: 'green'
        }
      },
      selectedRowKeys: [],
      selectedRow: [],
      show: false,
      queryParams: {
        pageNo: 1,
        pageSize: 10
      }
    };
  },
  methods: {
    getList(params) {
      console.log(params);
      if (params) {
        Object.assign(this.queryParams, params);
      }
      componeyList(this.queryParams).then(res => {
        this.config.dataSource = res.data.records;
        this.config.pagination.total = res.data.total;
      });
    },
    changeStatus({ id, status }) {
      this.$message.success(status ? '发布成功' : '下线成功');
    },
    remove(record) {
      this.$message.success('删除成功');
      this.$refs.htable.refresh(true);
    },
    search(params) {
      Object.assign(this.queryParams, params);
      this.$refs.htable.refresh();
    }
  }
};
</script>
<style lang="less" scoped>
.article-page {
  // .a-button-blue {
  //   position: absolute;
  //   right: 0;
  //   top: 0;
  // }
}
</style>
